<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>跨模块常量</title>
</head>
<body>
    <h1>跨模块常量</h1>

    <script type="module">
        // constants/db.js
        export const db = {
            url: 'http://my.couchdbserver.local:5984',
            admin_username: 'admin',
            admin_password: 'admin password'
        };

        // constants/user.js
        export const users = ['root', 'admin', 'staff', 'ceo', 'chief', 'moderator'];

        // constants/index.js
        export { db } from './db';
        export { users } from './user';

        // 使用常量
        import { db, users } from './constants/index.js';
        console.log(db.url);
        console.log(users.length);

        // 多个常量
        // constants/config.js
        export const TIMEOUT = 5000;
        export const DEBUG = false;
        export const API_VERSION = 'v1';
        export const BASE_URL = 'https://api.example.com';

        // 分组常量
        // constants/permissions.js
        export const ROLE = {
            ADMIN: 'admin',
            USER: 'user',
            GUEST: 'guest'
        };

        export const PERMISSION = {
            READ: 'read',
            WRITE: 'write',
            DELETE: 'delete'
        };

        // 实际应用示例
        // constants/app.js
        export const APP_CONFIG = {
            name: '示例应用',
            version: '1.0.0',
            settings: {
                theme: 'light',
                language: 'zh-CN',
                notifications: true
            },
            api: {
                baseUrl: 'https://api.example.com',
                timeout: 5000,
                retryCount: 3
            }
        };

        // 使用配置
        import { APP_CONFIG } from './constants/app.js';

        class App {
            constructor() {
                this.config = APP_CONFIG;
                this.init();
            }

            init() {
                console.log(`初始化 ${this.config.name} v${this.config.version}`);
                this.setupAPI();
            }

            setupAPI() {
                const { baseUrl, timeout } = this.config.api;
                console.log(`API配置: ${baseUrl}, 超时: ${timeout}ms`);
            }
        }

        new App();
    </script>
</body>
</html> 